<template>
	<view class="main-box">
		<u-navbar title="个人中心" :autoBack="false" bgColor="#00000000" @leftClick="toHomeFun"></u-navbar>
		<view class="bg-box">
			<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/bg-d.png"></image>
		</view>
		<view class="fixd-box" :style="'height:'+statusBarHeight+'px'">
			<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/bg-d.png" mode="widthFix"></image>
		</view>
		<view class="user-box" :style="'margin-top:'+statusBarHeight+'px'">
			<view class="img" @click="lookImgFun">
				<image :src="userInfo.headimg || '/static/images/photo.png'"></image>
			</view>
			<view class="btn" @click="$u.route('/pages/tabbar/myEidt')">编辑资料</view>
			<view class="name">
				{{userInfo.realname || '暂无昵称'}}
				<!-- <image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my1.png" @click="$u.route('/pages/tabbar/myEidt')"></image> -->
			</view>
			<view class="span">
				{{userInfo.gender == 1?'男':userInfo.gender == 2?'女':'未知'}} | {{userInfo.age?userInfo.age+'岁':'暂无年龄'}} |
				{{userInfo.remark||'暂无标签'}}
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/scans/historicRecords')" v-if="check_search">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my2.png"></image>
				历史记录
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/users/wallet')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my8.png"></image>
				我的钱包
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<!-- <view class="input-box" @click="$u.route('/pages/tabbar/shop')">
      <view class="name">
        <image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/img-999.png"></image>
        精选好物
      </view>
      <view class="value">
        <image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
      </view>
    </view> -->
		<view class="input-box" @click="$u.route('/pages/scans/Collection')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my3.png"></image>
				我的收藏
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/login/privacyPact?type=1')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my4.png"></image>
				用户协议
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/login/privacyPact?type=2')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my4.png"></image>
				隐私协议
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/login/loginView?type=1')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my2.png"></image>
				使用说明
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box" @click="$u.route('/pages/login/reportRuler')">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/report.png"></image>
				反馈提示
			</view>
			<view class="value">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my7.png"></image>
			</view>
		</view>
		<view class="input-box">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my5.png"></image>
				版本号
			</view>
			<view class="value">
				{{versionNums}}
			</view>
		</view>

		<view class="input-box" @click="logoutFun">
			<view class="name">
				<image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my6.png"></image>
				退出登录
			</view>
		</view>

		<!-- <slideCode ref="slidecode" :modelValue="slideCodeObj" @success="onSuccess"></slideCode> -->

		<!-- <view class="input-box" @click="logoutFunOne">
      <view class="name">
        <image src="https://jichacha-bt-bak.oss-cn-shenzhen.aliyuncs.com/wxxcx/static/images/my6.png"></image>
        注销账号
      </view>
    </view> -->
	</view>
</template>
<script>
	import {
		getUserInfo,
		getCheckAppStatus,
		check_search_status,
	} from '@/api/api.js';
	import app from "@/config/app.js";
	// import slideCode from '@/uni_modules/xlg-slideCode_0.0.6/xlg_slideCode/xlg_slideCode.vue'
	export default {
		name: 'userView',
		// components: {
		// 	slideCode
		// },
		data() {
			return {
				statusBarHeight: 0,
				userInfo: {},
				sbmitMain: false,
				versionNums: app.hot.versionNumberAnd,
				check_search: false,
				// slideCodeObj: {},
			}
		},
		onLoad(opition) {
			const that = this;
			uni.getSystemInfo({
				success(res) {
					that.statusBarHeight = res.statusBarHeight + 55;
				}
			});
			// this.slideCodeObj = {
			// 	class: '',
			// 	show: true
			// }
		},
		onShow() {
			getCheckAppStatus().then((res) => {
				this.sbmitMain = res.data
			})
			check_search_status().then((res) => {
				uni.setStorageSync('check_search', res.data)
				this.check_search = res.data
			}).catch(err => {
				uni.setStorageSync('check_search', false)
				this.check_search = false
			})
			getUserInfo().then((res) => {
				this.userInfo = res.data
			})
			// this.donghua()
		},
		onBackPress() {
			return uni.reLaunch({
				url: '/pages/tabbar/index'
			})
		},
		methods: {
			// onSuccess() {
			// 	console.log('验证通过')
			// },

			lookImgFun() {
				// 节前过审暂时隐藏
				// uni.previewImage({
				//   urls: [this.userInfo.headimg || '/static/images/photo.png']
				// })
			},
			toHomeFun() {
				uni.reLaunch({
					url: '/pages/tabbar/index'
				})
			},
			// logoutFunOne() {
			//   const that = this;
			//   uni.showModal({
			//     title: '提示',
			//     content: '是否注销账号,注销后5天内将无法注册和登录',
			//     success(res) {
			//       if (res.confirm) {
			//         that.$store.commit('LOGOUT')
			//         let loginArr = uni.getStorageSync("loginArr")
			//         if (!loginArr) loginArr = []
			//         if (loginArr.indexOf(that.userInfo.id) == -1) {
			//           loginArr.push(that.userInfo.id)
			//         }
			//         uni.setStorageSync('loginArr', loginArr);
			//         uni.reLaunch({
			//           url: '/pages/login/login'
			//         })
			//       }
			//     }
			//   })
			// },
			logoutFun() {
				const that = this;
				uni.showModal({
					title: '提示',
					content: '是否退出登录',
					success(res) {
						if (res.confirm) {
							that.$store.commit('LOGOUT')
							uni.setStorageSync("token", '')
							uni.reLaunch({
								url: '/pages/login/login'
							})
						}
					}
				})
			},
		}

	}
</script>
<style lang="scss" scoped>
	.line1 {
		white-space: nowrap;
		overflow: hidden; //文本超出隐藏
		text-overflow: ellipsis; //文本超出省略号替代
	}

	view {
		box-sizing: border-box;
	}

	.fixd-box {
		width: 750rpx;
		height: 190rpx;
		position: fixed;
		z-index: 9;
		left: 0;
		top: 0;
		overflow: hidden;

		image {
			width: 100%;
			display: inline-block;
			vertical-align: top;
		}
	}

	.bg-box {
		width: 750rpx;
		height: 1624rpx;
		position: absolute;
		z-index: 0;
		left: 0;
		top: 0;

		image {
			width: 100%;
			height: 100%;
			display: inline-block;
			vertical-align: top;
		}
	}

	.main-box {
		width: 100%;
		min-height: 100vh;
		overflow: hidden;
		position: relative;
		padding-top: 50rpx;
		padding-bottom: 50rpx;
		background-color: #f0f4f9;

		.user-box {
			width: 660rpx;
			border-radius: 20rpx;
			padding: 30rpx;
			background-color: #ffffff;
			margin: 0 auto;
			position: relative;
			z-index: 1;
			padding-top: 100rpx;
			color: #7b828c;
			line-height: 80rpx;
			font-size: 26rpx;
			font-weight: 400;

			.img {
				width: 160rpx;
				height: 160rpx;
				border-radius: 50%;
				border: solid 4rpx white;
				position: absolute;
				left: 30rpx;
				top: -50rpx;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
					display: inline-block;
					vertical-align: top;
				}
			}

			.btn {
				line-height: 70rpx;
				background-color: #2b3d72;
				width: 200rpx;
				text-align: center;
				border-radius: 8rpx;
				color: white;
				position: absolute;
				right: 30rpx;
				top: 30rpx;
				font-size: 28rpx;
			}

			.name {
				color: #434242;
				font-size: 34rpx;
				font-weight: 700;
				line-height: 100rpx;

				image {
					width: 32rpx;
					height: 32rpx;
					display: inline-block;
					vertical-align: top;
					margin: 34rpx 20rpx;
				}
			}
		}

		.input-box {
			width: 660rpx;
			line-height: 128rpx;
			border-radius: 20rpx;
			background-color: white;
			padding: 0 30rpx;
			overflow: hidden;
			margin: 30rpx auto;
			color: #434242;
			font-size: 30rpx;
			font-weight: 400;
			position: relative;
			z-index: 1;

			.name {
				width: 60%;
				display: inline-block;
				vertical-align: top;

				image {
					width: 38rpx;
					height: 38rpx;
					display: inline-block;
					vertical-align: top;
					margin: 45rpx 15rpx 0 0;
				}
			}

			.value {
				width: 40%;
				display: inline-block;
				vertical-align: top;
				text-align: right;

				image {
					width: 16rpx;
					height: 30rpx;
					display: inline-block;
					vertical-align: top;
					margin: 50rpx 0 0 0;
				}
			}
		}
	}
</style>